﻿@{
	ViewBag.Title = "AccountIndex";
	Layout = "~/Views/Shared/_Index.cshtml";
}

<div class="layuimini-container">
	<div class="layuimini-main">

		@* 搜索信息 *@
		<fieldset class="table-search-fieldset layui-hide" id="searchField">
			<div>
				<form class="layui-form layui-form-pane" action="">
					<div class="layui-form-item">
						<div class="layui-inline">
							<div class="layui-input-inline">
								<input type="text" name="keyword" autocomplete="off" placeholder="输入关键词" class="layui-input">
							</div>
						</div>
						<div class="layui-inline" style="width:405px!important;">
							<label class="layui-form-label">公告日期:</label>
							<div class="layui-input-inline">
								<div class="layui-inline">
									<input name="time" style="width:286px!important;" type="text" autocomplete="off" class="layui-input" id="time" placeholder="选择公告日期范围">
								</div>
							</div>
						</div>
						<div class="layui-inline" style="width:405px!important;">
							<label class="layui-form-label">注册日期:</label>
							<div class="layui-input-inline">
								<div class="layui-inline">
									<input name="createtime" style="width:286px!important;" type="text" autocomplete="off" class="layui-input" id="createtime" placeholder="选择注册日期范围">
								</div>
							</div>
						</div>
						<div class="layui-inline">
							<div class="layui-input-inline">
								<select id="sell_state" name="sell_state" lay-filter="sell_state" lay-search>
									<option value="">选择出售状态</option>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<div class="layui-input-inline">
								<select id="read_State" name="read_State" lay-filter="read_State" lay-search>
									<option value="">选择读取状态</option>
									<option value="0">未读</option>
									<option value="1">已读</option>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<div class="layui-input-inline">
								<select id="state" name="state" lay-filter="state" lay-search>
									<option value="">选择账号状态</option>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<div class="layui-input-inline">
								<select id="monthNum" name="monthNum" lay-filter="monthNum" lay-search>
								</select>
							</div>
						</div>
						<div class="layui-inline">
							<button type="submit" class="layui-btn layui-btn-primary" lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
						</div>
					</div>
				</form>
			</div>
		</fieldset>
		@* 数据表格顶部按钮 *@
		<script type="text/html" id="toolbarDemo">
			<div class="layui-btn-container" id="toolbar">
				@* <button id="NF-add" name="NF-add" authorize class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">&#xe654;</i>新增</button>
					<button id="NF-edit" name="NF-edit" authorize class="layui-btn layui-btn-sm layui-btn-warm layui-hide" lay-event="edit"><i class="layui-icon">&#xe642;</i>修改</button> *@
				<button id="NF-delete" name="NF-delete" authorize class="layui-btn layui-btn-sm layui-btn-danger layui-hide" lay-event="delete"> <i class="layui-icon">&#xe640;</i>删除</button>
				<button id="NF-Select" name="NF-Select" authorize class="layui-btn layui-btn-sm layui-btn-blue layui-hide" lay-event="select"> <i class="layui-icon">&#xe64c;</i>查看</button>
				<button id="NF-collection" name="NF-collection" authorize class="layui-btn layui-btn-sm layui-btn-warm layui-hide" lay-event="collection"> <i class="layui-icon">&#xe67b;</i>收藏</button>
				<button id="NF-cancel" name="NF-cancel" authorize class="layui-btn layui-btn-sm layui-btn-normal layui-hide" lay-event="cancel"> <i class="layui-icon">&#xe67a;</i>取消收藏</button>
			</div>
		</script>
		@* 行按钮 *@
		<script type="text/html" id="currentTableBar">
			<a id="NF-delete" authorize class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delete">删除</a>
			<a id="NF-Select" authorize class="layui-btn layui-btn-xs layui-btn-blue" lay-event="select">查看</a>
			{{#  if(d.Sc_State==0){ }}
			<a id="NF-collection" authorize class="layui-btn layui-btn-xs layui-btn-warm" lay-event="collection">收藏</a>
			{{# } else { }}
			<a id="NF-cancel" authorize class="layui-btn layui-btn-xs layui-btn-normal" lay-event="cancel">取消收藏</a>
			{{# } }}
		</script>
		@* 数据表格 *@
		<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
	</div>
</div>

<script>
	layui.use(['jquery', 'form', 'table', 'common', 'layer', 'optimizeSelectOption', 'commonTable','laydate'], function () {
		var $ = layui.jquery,
			laydate=layui.laydate,
			form = layui.form,
			table = layui.table,
			layer = layui.layer,
			commonTable = layui.commonTable,
			common = layui.common;

			//权限控制(js是值传递)
		currentTableBar.innerHTML = common.authorizeButtonNew(currentTableBar.innerHTML);
		toolbarDemo.innerHTML = common.authorizeButtonNew(toolbarDemo.innerHTML);
		//行点击事件监听，控制按钮显示
		var oneList = ["NF-delete","NF-Select"];//选择1条显示
		var morerList = ["NF-delete"];//选中1条以上显示
		//commonTable.tableRowClick("radio", "currentTableFilter", "currentTableId", oneList, morerList); //单选框
		commonTable.tableRowClick("checkbox", "currentTableFilter", "currentTableId", oneList, morerList); //多选框
		var userId=sessionStorage.getItem("user_id");
		// 数据表格
		commonTable.rendertable({
			elem: '#currentTableId',
			id: 'currentTableId',
			url: '/STZBManage/User/Get_Account_GridJson?userid='+userId,
			filter: {
				clearFilter: false
			},
			limit:50, //默认显示20条数据
			cols: [[
				{ type: "checkbox", width: 50, fixed: 'left'},
				{ field: 'Gg_EndTime', title: '公告结束时间', minWidth: 160, sort: true , filter: { type: 'date[yyyy/MM/dd HH:mm:ss]' },
					templet:function(d){
						if(d.Sell_state==1) //公示期
						{
							return '<span style="color:red;">'+d.Gg_EndTime+'</span>';
						}
						return d.Gg_EndTime;
					}
				},
				{ field: 'Sell_state', title: '出售状态', minWidth: 120, sort: true, filter: true,
					templet: function (d) {
						if(d.Sell_state==1){ //公示期
							return '<span style="color:red;">公示期</span>';
						}else{
							//Account_State：字典分类的ID
							return top.clients.dataItems["Sell_state"][d.Sell_state] == undefined ? d.State : top.clients.dataItems["Sell_state"][d.Sell_state];
						}

					}
				},
				{ field: 'Price', title: '价格', minWidth: 100, sort: true, filter: true,templet:function(d){
					return '￥'+d.Price.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
					}
				},
				{ field: 'Read_State', title: '读取状态', width: 120, sort: true,hide:true, filter: true,templet:function(d){
						if(d.Read_State==0){ //未读
							return '未读';
						}else{ //已读
							return '已读';
						}
					}
				},
				{ field: 'Sc_State', title: '收藏', width: 80, templet:function(d){
						if(d.Sc_State==0){ //未读
							return '<i class="layui-icon">&#xe67b;</i>';
						}else{ //已读
							return '<i class="layui-icon" style="color:#fdb721;">&#xe67a;</i>';
						}
					} 
				},
				{ field: 'WeaponsNumber', title: '武器数量', minWidth: 120, sort: true, filter: true,templet:function(d){
						return '<a style="cursor: pointer;color:blue;" href="javascript:void(0)" data-id="' + d.F_Id + '" class="link-weapons">'+d.WeaponsNumber+'&nbsp;&nbsp;<span style="color:red;">('+d.Wdzwq_Num+')</span></a>';
					}
				},
				{ field: 'Sty_Num', title: '四通玉数量', minWidth: 120, sort: true, filter: true },
				{ field: 'Tgc_Num', title: '天工锤数量', minWidth: 120, sort: true, filter: true },
				{ field: 'Ryds_Num', title: '荣誉点数量', minWidth: 120, sort: true, filter: true },
				{ field: 'Wqst_Num', title: '武器四通数量', minWidth: 140, sort: true, filter: true },
				{ field: 'PowderNumber', title: '粉武器数量', minWidth: 120, sort: true, filter: true ,templet:function(d){
						return '<a style="cursor: pointer;color:blue;" href="javascript:void(0)" data-id="' + d.F_Id + '" class="link-powder">'+d.PowderNumber+'</a>';
					}
				},
				{ field: 'Cbwq_Num', title: '擦边武器数量', minWidth: 140, sort: true, filter: true },
				{ field: 'State', title: '账号状态', minWidth: 120, sort: true, filter: true,
					templet: function (d) {
						//Account_State：字典分类的ID
						return top.clients.dataItems["Account_State"][d.State] == undefined ? d.State : top.clients.dataItems["Account_State"][d.State];
					}
				},
				{ field: 'Pty_Num', title: '普通玉数量', minWidth: 120, sort: true, filter: true },
				{ field: 'CreateTime', title: '注册时间', minWidth: 160, sort: true , filter: { type: 'date[yyyy/MM/dd HH:mm:ss]' }},
				{ field: 'Cbg_Url', title: '藏宝阁Url', minWidth: 180, sort: true, filter: true },
				{ title: '操作', width: 180, toolbar: '#currentTableBar', align: "center", fixed: 'right' }
			]],
			  done: function(res, curr, count){
			  // 遍历所有行，根据状态设置背景色
			  $("[data-field='Read_State']").each(function(){
				var tr = $(this).closest('tr');
				var content = $(this).text().trim();

				if(content.includes('未读')) {
				  //tr.css('background-color', '#fff9e6'); // 未读行的背景色
				} else if(content.includes('已读')) {
				  tr.css('background-color', '#d8f0d8  '); // 已读行的背景色
				}
			  });
			}
		});

		$(function(){
			initControl();
			TimeSelect();
			//日期时间范围
			laydate.render({
				elem: '#time'
				, type: 'datetime'
				, format: 'yyyy/MM/dd HH:mm:ss' //时间格式
				, range: true
				// , max: 0 //最大时间显示当天
				// , value: defaultValue
				, done: function (value, date, endDate) {
					if (value === '') {
						// 当用户点击清除按钮时，value 为空
						$(this.elem).val(''); // 强制清空输入框
					}
				}
			});

			//日期时间范围
			laydate.render({
				elem: '#createtime'
				, type: 'datetime'
				, format: 'yyyy/MM/dd HH:mm:ss' //时间格式
				, range: true
				// , max: 0 //最大时间显示当天
				// , value: ''
				, done: function (value, date, endDate) {
					if (value === '') {
						// 当用户点击清除按钮时，value 为空
						$(this.elem).val(''); // 强制清空输入框
					}
				}
			});

			form.render();
		});

	// 粉武器数量绑定点击事件
	$(document).on('click', '.link-powder', function() {
			var id = $(this).data('id'); //数据id
			ShowNewTab('粉武器','2',id);
	});

	// 武器数量绑定点击事件
	$(document).on('click', '.link-weapons', function() {
			var id = $(this).data('id'); //数据id
			ShowNewTab('武器','0',id);
	});

	//跳转新的标签页
	function ShowNewTab(title,type,id){
		  common.openNewTabByIframe({
				title: title,
				href: "/STZBManage/Account/Index?id="+id+"&type="+type,
			});
			common.ajax({
				url: "/STZBManage/User/Update_ReadState",
				data: { idStr: id,userid: userId },
				dataType: "json",
				async: false,
				success: function () {

				}
			});
	}

		wcLoading.close(); //关闭加载窗

		//初始化下拉列表数据
		function initControl(){
			 //绑定数据源
			//类型为出售状态下拉框
			$("#sell_state").bindSelect({
				data: top.clients.dataItems["Sell_state"], //Sell_state：字典分类ID
				id: ""
			});

			//类型为账号状态下拉框
			$("#state").bindSelect({
				data: top.clients.dataItems["Account_State"], //Account_State：字典分类ID
				id: ""
			});


		}

		//初始化下拉列表数据
		function TimeSelect(){
			 //绑定数据源
			//类型为下拉框时
			$("#monthNum").bindSelect({
				data: top.clients.dataItems["STZB_MonthNum"], //STZB_MonthNum：字典分类ID
				id: ""
			});
		}


		// 监听搜索操作
		form.on('submit(data-search-btn)', function (data) {
			//执行搜索重载
			commonTable.reloadtable({
				elem: 'currentTableId',
				curr: 1, //页数
				where: { //参数
					keyword: data.field.keyword,
					sell_state: data.field.sell_state==''?0:data.field.sell_state,
					monthNum: data.field.monthNum==''?0:data.field.monthNum,
					timeStr:data.field.time,
					read_State:data.field.read_State,
					state_val:(data.field.state==''?0:data.field.state),
					createTime:data.field.createtime
				}
			});
			return false;
		});

		//行按钮监听事件
		table.on('tool(currentTableFilter)', function (obj) {
			var id = obj.data.F_Id;

			if (obj.event === 'delete') { //删除按钮
				common.deleteForm({
					url: "/STZBManage/User/Delete_Account",
					param: { ids: id },
					success: function () {
						obj.del();
					}
				});
			}else if(obj.event==='select'){ //查看按钮
				 common.ajax({
					url: "/STZBManage/User/Update_ReadState",
					data: { idStr: id,userid: userId },
					dataType: "json",
					async: false,
					success: function () {
						//跳转链接
						window.open(obj.data.Cbg_Url, '_blank');
					}
				});

			}else if(obj.event==='collection'){ //收藏按钮
				common.ajax({
					url: "/STZBManage/User/AddOrEdit_Collection",
					data: { ids: id,type:1,userid:userId },
					dataType: "json",
					async: false,
					success: function (res) {
						layer.msg(res.message);
						if(res.state=="success"){
							 obj.update({
							  Sc_State: 1
							}, true);
						}
					}
				});

			}else if(obj.event==='cancel'){ //取消收藏按钮
				common.ajax({
					url: "/STZBManage/User/AddOrEdit_Collection",
					data: { ids: id,type:2,userid:userId },
					dataType: "json",
					async: false,
					success: function (res) {
						layer.msg(res.message);
						if(res.state=="success"){
							obj.update({
							  Sc_State: 0
							}, true);
						}

					}
				});

			}
			return false;
		});

		//数据表格顶部按钮监听事件
		table.on('toolbar(currentTableFilter)', function (obj) {
			var data = table.checkStatus('currentTableId').data;
			var id = data.length > 0 ?data[0].F_Id:null;
			 if (obj.event === 'delete') { //删除按钮
				if (data.length == 0) {
					common.modalMsg("未选中数据", "warning");
					return false;
				}
				var ids = [];
				for (var i = 0; i < data.length; i++) {
					ids.push(data[i].F_Id);
				}
				common.deleteForm({
					url: "/STZBManage/User/Delete_Account",
					param: { ids: ids.join(',') },
					success: function () {
						common.reload('data-search-btn');
					}
				});
			}
			else if(obj.event==='select'){ //查看按钮
				//跳转链接
				window.open(data[0].Cbg_Url, '_blank');
			}
			else if (obj.event === 'TABLE_SEARCH') { //搜索按钮
				var _that = $("#searchField");
				if (_that.hasClass("layui-hide")) {
					_that.removeClass('layui-hide');
				} else {
					_that.addClass('layui-hide');
				}
				table.resize();
			}
			return false;
		});
	});
</script>
